<template>
  <div class="header">
    <div class="header-left">
      <div class="iconfont">&#58916;</div>
    </div>
    <div class="header-input">
      <div class="iconfont">&#58930;</div>
      <input class="input-text" type="text" placeholder="请输入内容">
    </div>
    <div class="header-right">
      城市
      <div class="iconfont">&#58954;</div>
    </div>
  </div>
</template>
<script>
export default {
  name: 'homeHeader'
}
</script>
<style lang="stylus" scoped>
  @import '~styles/varibles.styl'
  .header
    color white
    height 0.86rem
    display flex
    background $bgColor
  .header-left
    display flex
    width 0.64rem
    align-items center
    justify-content center
  .header-right
    width 1.24rem
    display flex
    /*justify-content center*/
    align-items center
    .iconfont
      padding-bottom  .04rem
      padding-left 0.1rem
  .header-input
    display flex
    margin 0.2rem
    flex 1
    align-items center
    background white
    padding-left 0.1rem
    .input-text
      flex 1
      padding-left 0.05rem
    .iconfont
      color #cacaca
</style>
